<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
       <title>Formulaire</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
       <script language="javascript">
            function showList() {

                var select = document.getElementById('liste');

                if(select.value == "l1") {
                    document.getElementById('l1').setAttribute('style','visibility:inline');
                } else if(select.value == "l2") {
                    document.getElementById('l2').setAttribute('style','visibility:inline');
                } else {
                    document.getElementById('l3').setAttribute('style','visibility:inline');
                }
            }

       </script>
   </head>
   <body>
       
       <select id="liste" onBlur="javascript:showList();">
       <option value="l1">Liste 1
       <option value="l2">Liste 2
       <option value="l3">Liste 3
       </select>

       <select id="l1" style="visibility:hidden">
       <option value="11">Liste 1 Choix 1
       <option value="12">Liste 1 Choix 2
       </select>
       
       <select id="l2" style="visibility:hidden">
       <option value="21">Liste 2 Choix 1
       <option value="22">Liste 2 Choix 2
       </select>
       <select id="l3" style="visibility:hidden">
       <option value="31">Liste 3 Choix 1
       <option value="32">Liste 3 Choix 2
       </select>
   </body>
</html>